<template>
    <BPTable ref='tableRef' align='center' row-key='id' name-key='name' :columns='columns' :api='page'>
        <template #status="{text}">
            <a-tag color="processing" v-if="text == 0">
                <template #icon>
                    <sync-outlined :spin="true" />
                </template>
                processing
            </a-tag>
            <a-tag color="processing" v-else-if="text == 1">完成</a-tag>
            <a-tag color="error" v-else>失败</a-tag>
        </template>
    </BPTable>
</template>

<script lang="ts" setup>
    import { devicePageApi } from "@/api/Ota";
import { parseTime } from "@/utils";
import { SyncOutlined } from "@ant-design/icons-vue";
import { ref } from "vue";

    const props = defineProps<{
        task:number
    }>()

    function page(params) {
        return devicePageApi({task:props.task, ...params})
    }

    const columns = ref<Column[]>([
        {
            dataIndex : 'deviceId',
            title : '设备',
            inSearch : true,
            transform : (v) => Number(v)
        },

        {
            dataIndex : 'status',
            title : '状态',
        },

        {
            title : '完成时间',
            dataIndex : 'completeTime',
            align : 'center',
            customRender({text}) {
                return parseTime(text)
            }
        }
    ])
</script>